<template>

    <div>
        <el-form :inline="true" :model="formInline" label-width="200px" class="demo-form-inline" :rules="rules"
            ref="ruleFormRef">

            <el-form-item label="编号" prop="number">
                <el-input v-model="formInline.number" clearable />
            </el-form-item>


            <!-- <el-form-item label="设备名称" prop="equipmentName">
                <el-input v-model="formInline.equipmentName" clearable />
            </el-form-item> -->
            <el-form-item label="设备名称" prop="equipmentName">
                <el-select v-model="formInline.equipmentName" placeholder="选择设备">
                    <el-option label="电脑" value='电脑' />
                    <el-option label="平板扫描" value='平板扫描' />
                    <el-option label="高速扫描" value='高速扫描' />
                    <el-option label="打印机" value='打印机' />
                    <el-option label="刻录机" value='刻录机' />
                    <el-option label="A3扫描" value='A3扫描' />
                    <el-option label="大图扫描" value='大图扫描' />
                    <el-option label="交换机" value='交换机' />
                    <el-option label="监控" value='监控' />
                    <el-option label="电钻" value='电钻' />
                    <el-option label="加密狗" value='加密狗' />
                    <el-option label="录入笔" value='录入笔' />
                    <el-option label="插板" value='插板' />
                    <el-option label="裁纸刀" value='裁纸刀' />
                    <el-option label="其他" value='其他' />
                </el-select>
            </el-form-item>



            <el-form-item label="项目负责人" prop="projectLeader">
                <el-input v-model="formInline.projectLeader" clearable />
            </el-form-item>
            <el-form-item label="项目名称" prop="entryName">
                <el-input v-model="formInline.entryName" clearable />
            </el-form-item>
            <el-form-item label="型号">
                <el-input v-model="formInline.model" clearable />
            </el-form-item>

            <el-form-item label="所属部门" prop="belonging">
                <el-select v-model="formInline.belonging" placeholder="选择部门">
                    <el-option label="数据一部" value=1 />
                    <el-option label="数据二部" value=2 />
                    <el-option label="数据三部" value=3 />
                    <el-option label="数据四部" value=4 />
                    <el-option label="数据五部" value=5 />
                    <el-option label="办公室" value=6 />
                    <el-option label="其他" value=7 />

                </el-select>
            </el-form-item>
            <el-form-item label="实在部门" prop="realDepartment">
                <el-select v-model="formInline.realDepartment" placeholder="选择部门">
                    <el-option label="数据一部" value=1 />
                    <el-option label="数据二部" value=2 />
                    <el-option label="数据三部" value=3 />
                    <el-option label="数据四部" value=4 />
                    <el-option label="数据五部" value=5 />
                    <el-option label="办公室" value=6 />
                    <el-option label="其他" value=7 />

                </el-select>
            </el-form-item>
            <el-form-item label="序列号">
                <el-input v-model="formInline.serialNumber" clearable />
            </el-form-item>
            <el-form-item label="是否使用客户硬盘">
                <el-input v-model="formInline.position" clearable />
            </el-form-item>
            <el-form-item label="客户硬盘序列号">
                <el-input v-model="formInline.customerDrive" clearable />
            </el-form-item>

            <el-form-item label="设备使用情况" prop="usageSituation">
                <el-select v-model="formInline.usageSituation" placeholder="使用情况">
                    <el-option label="使用中" value='使用中' />
                    <el-option label="闲置" value='闲置' />
                </el-select>
            </el-form-item>

            <el-form-item label="机箱">
                <el-select v-model="formInline.chassisCondition" placeholder="选择">
                    <el-option label="是" value='是' />
                    <el-option label="否" value='否' />
                </el-select>
            </el-form-item>
            <el-form-item label="备注">
                <el-input v-model="formInline.remarks" clearable />
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="onSubmit(ruleFormRef)">添加</el-button>
            </el-form-item>
        </el-form>
    </div>
</template>

<script setup>
import { reactive } from 'vue'
import { gettables, gettablebm, changelist, addlist } from '../../sevce/user'
import { defineProps, onMounted, ref, computed } from 'vue';
import { ElMessage } from 'element-plus'
const formInline = reactive({
    number: '',
    equipmentName: '',
    entryName: '',
    model: '',
    belonging: '',
    realDepartment: '',
    serialNumber: '',
    projectLeader: '',
    applicationTime: '',
    position: '',
    customerDrive: '',
    usageSituation: '',
    equipmentStatus: 1,//设备状态
    processStatus: 1,//流程状态
    remarks: '',
    approvalTime: '',
    chassisCondition: '',
    maintenanceRecord: '',
    checkStatus: 1,
})
//表单校验
const ruleFormRef = ref()
const rules = reactive({
    belonging: [
        {
            required: true,
            message: '所属部门不能为空',
            trigger: 'blur',
        },
    ],
    realDepartment: [
        {
            required: true,
            message: '实在部门不能为空',
            trigger: 'blur',
        },
    ],
    usageSituation: [
        {
            required: true,
            message: '使用情况不能为空',
            trigger: 'blur',
        },
    ],
    number: [
        {
            required: true,
            message: '编号不能为空',
            trigger: 'blur',
        },
    ],
    equipmentName: [
        {
            required: true,
            message: '名称不能为空',
            trigger: 'blur',
        },
    ],
    projectLeader: [
        {
            required: true,
            message: '负责人不能为空',
            trigger: 'blur',
        },
    ],
    entryName: [
        {
            required: true,
            message: '所在项目不能为空',
            trigger: 'blur',
        },
    ],
})

const onSubmit = async (formEl) => {
    if (!formEl) return
    await formEl.validate((valid, fields) => {
        if (valid) {
            // console.log('submit!')
            addlist(formInline).then((res) => {
                if (res.data == 0) {
                    ElMessage.error('添加失败')
                } else if (res.data == 1) {
                    ElMessage({
                        message: '添加成功',
                        type: 'success',
                    })
                }
            }).catch(() => {
                ElMessage.error('出错了，请联系管理员')
            })
        } else {
            ElMessage.error('信息填写不完整')
        }
    })
}
// const onSubmit = () => {
//     console.log('submit!')
//     addlist(formInline).then(() => {
//         console.log('okk')
//     })

// }



onMounted(() => {
})
</script>

<style lang="scss" scoped>
.demo-form-inline .el-input {
    --el-input-width: 220px;
}

.demo-form-inline .el-select {
    --el-select-width: 220px;
}
</style>




<!-- <template>
    <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-width="120px" class="demo-ruleForm"
        :size="formSize" status-icon>
        <el-form-item label="Activity name" prop="name" required>
            <el-input v-model="ruleForm.name" />
        </el-form-item>
        <el-form-item label="Activity zone" prop="region">
            <el-select v-model="ruleForm.region" placeholder="Activity zone">
                <el-option label="Zone one" value="shanghai" />
                <el-option label="Zone two" value="beijing" />
            </el-select>
        </el-form-item>
        <el-form-item label="Activity count" prop="count">
            <el-select-v2 v-model="ruleForm.count" placeholder="Activity count" :options="options" />
        </el-form-item>
        <el-form-item>
            <el-button type="primary" @click="submitForm(ruleFormRef)">Create</el-button>
        </el-form-item>
    </el-form>
</template>

<script setup>
import { reactive, ref } from 'vue'

const formSize = ref('default')
const ruleFormRef = ref()
const ruleForm = reactive({
    name: '',
    count: '',
})

const rules = reactive({
    name: [
        {
            required: true,
            message: 'name不能为空',
            trigger: 'change',
        },
    ],

    count: [
        {
            required: true,
            message: 'cont不能为空',
            trigger: 'change',
        },
    ],
})

const submitForm = async (formEl) => {
    if (!formEl) return
    await formEl.validate((valid, fields) => {
        if (valid) {
            console.log('submit!')
        } else {
            console.log('error submit!', fields)
        }
    })
}

const options = Array.from({ length: 10000 }).map((_, idx) => ({
    value: `${idx + 1}`,
    label: `${idx + 1}`,
}))
</script> -->